@charset "UTF-8";
body,
    html,
    #hunderdZone {
        width: 100%;
        height: 100%;
        overflow-y: scroll;
    }
    
    * {
        margin: 0;
        padding: 0;
    }
    
    #hZcontainer {
        width: 100%;
        height: 100%;
        @include flexbox();
        @include flex-direction(column);
        @extend %zone-header;
        .section {
            @include flex();
            width: 100%;
           // height:100%;
            @include flexbox();
            @include flex-direction(column);
            .hz-wraper {
                width: 100%;
                height: 34.5%;
                img {
                    width: 100%;
                    height: 100%;
                }
            }
            .hz-swap {
                width: 100%;
                height: 17.5%;
                a {
                    img {
                        width: 100%;
                        height: 100%;
                    }
                }
            }

            @extend %wine-list;
              .hz-rule{
                height:78%;
                    background:rgba(0,0,0,0.15);
                font-size:4vw;
                .hz-mon{
                    width: 96%;
                    margin-left:2%;
                    padding: 0 2%;
                    height: 15vw;
                    text-align:center;
                    @include flexbox();
                    @include justify-content(center);
                    @include align-items(center); //垂直
                    em{
                        display: inline-block;
                        height: 1vw;
                        width: 8vw;
                    }
                    p{
                        padding: 0 2%;   
                    }
                }
                .hzrule-con{

                    p{
                        line-height:150%;
                    }
                }
            }
           @extend %load-wj;
        }
    }